<template>
	<view class="page">
		<view class="tips"><text>最多可添加5位就诊人</text></view>
		<view v-for="v in cardList" :key="v.id" @click="edit(v)">
			<person-card :cardData="v" @refresh="getData"></person-card>
		</view>

		<view @click="add" class="submit">添加就诊人</view>
	</view>
</template>

<script setup>
	import PersonCard from './PersonCard.vue'
	import {
		getPatientList
	} from '@/api/personApi.js'
	import {
		ref,
		onBeforeMount
	} from 'vue'
	import {
		useLoginStore
	} from '@/store/loginStore.js'
	import {
		onShow
	} from '@dcloudio/uni-app'
	onShow(() => {
		getData()
	})
	const getData = async () => {
		let {
			data
		} = await getPatientList()
		if (data.code === 0) {
			cardList.value = data.data
		}
		// console.log('刷新数据')
	}
	const add = () => {
		if (cardList.value.length >= 5) {
			uni.showToast({
				title: '最多添加5位就诊人',
				icon: 'error'
			})
			return
		}
		uni.navigateTo({
			url: '../addPersonSee/addPersonSee'
		})
	}
	const edit = v => {

		const loginStore = useLoginStore()
		loginStore.editData = v
		uni.navigateTo({
			url: '../editPersonSee/editPersonSee'
		})
	}
	const cardList = ref([])
</script>

<style lang="less" scoped>
	.page {
		padding-bottom: 30rpx;

		.tips {
			color: #ff9138;
			background: #fbf1e9;
			padding: 30rpx;
			font-size: 24rpx;
			height: 40rpx;
			line-height: 40rpx;
		}

		.submit {
			margin: 60rpx auto;
			margin-bottom: 0;
			background: #006eff;
			color: #fff;
			height: 80rpx;
			width: 686rpx;
			text-align: center;
			line-height: 80rpx;
			border-radius: 4px;
		}
	}
</style>
